{% extends "common/main.html" %}

{% block script %}
<!-- Key for: watotowabaraka.org -->
<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAALL1hIwcEGBqreNtP24U5hhSj7KXZzqxrxxBoQPTOQN97FXRIOBTVyjZbDcJMQWp1ztWMtI4k_9XvDQ"></script>

<!-- Maps code. -->
<script type="text/javascript" src="/js/map.js"></script>

<!-- Set-up. -->
<script type="text/javascript">
  google.load("maps", "2.x");

  var MyMap = null;

  // Call this function when the page has been loaded
  google.setOnLoadCallback(function() {
    MyMap = new Map(document.getElementById("map"));
  });

  var Volunteers = {}
  //{% for v in volunteers %}
  Volunteers["{{ v.key }}"] = {
    "name"        : "{{ v.get_name }}",
    "address"     : "{{ v.get_address }}"
  };
  //{% endfor %}
</script>
{% endblock script %}

{% block heading %}
  <div id="map" class="map"></div>
  <div id="status" class="map-status">&nbsp;</div>
{% endblock heading %}

{% block main %}
  We are about an hour's drive North of Nairobi. Come and visit us!
  <br/><br/>
  <button onclick="MyMap.showMarkers(Volunteers)">Show All Volunteers</button>
{% endblock main %}
